<template>
    <div class="store-list">
        <div class="header">
            <h3>
                店铺列表
            </h3>
            <el-button type="primary" @click="createStore">新建店铺</el-button>
        </div>
        <el-table :data="storeList" style="width: 100%">
            <el-table-column prop="uniacid" label="ID" width="90" />
            <el-table-column prop="name" label="名称" width="180" />
            <el-table-column prop="description" label="描述" width="180" />
            <el-table-column prop="logo" label="LOGO">
                <template #default="scope">
                    <img style="width:50px;height:50px" :src="scope.row.logo" alt="">
                </template>
            </el-table-column>
            <el-table-column prop="" label="操作">
                <template #default="scope">
                    <el-button link type="primary" size="small" @click.prevent="gotoStore(scope.row.uniacid)">
                        进入
                    </el-button>
                </template>
            </el-table-column>
        </el-table>
    </div>

    <el-dialog
        v-model="dialogVisible"
        title="新建店铺"
        width="500"

    >
        <el-input v-model="new_shop_name" placeholder="请输入店铺名称"></el-input>
        <template #footer>
        <div class="dialog-footer">
            <el-button @click="dialogVisible = false">取消</el-button>
            <el-button type="primary" @click="doCreateStore">
            确定
            </el-button>
        </div>
        </template>
    </el-dialog>

</template>

<script lang="ts" setup>
import { ref } from 'vue'
import { useRouter } from 'vue-router';
import axios from 'axios'
const dialogVisible = ref(false)
const new_shop_name = ref('')
const router2 = useRouter();
const storeList = ref([])
const getStoreList = () => {


    const url = window.VITE_URL + '/admin.uniAccount/index';
    axios.get(url).then((res: any) => {

        if (!res.data.code) {
            storeList.value = res.data;
        }

    });
}

getStoreList();

const gotoStore = (store_id: any) => {
    const url = window.VITE_URL + '/admin.uniAccount/current';

    const data = {
        uniacid: store_id
    };
    axios.post(url, data).then((res: any) => {

        if (!res.data.code) {
            storeList.value = res.data;
        }
        router2.push('/main');

    });
}

const createStore = () => {

    dialogVisible.value = true;

}

const doCreateStore = ()=>{
    // console.log(' 添加新的店铺 ')
    dialogVisible.value = false;
    const url = window.VITE_URL + '/admin.uniAccount/create';

    let data = {
        shop_name: new_shop_name.value
    };
    axios.post(url, data).then((res: any) => {

        if (!res.data.code) {
            // storeList.value = res.data;

            // todo 显示错误信息
            
        }

        getStoreList();

    });

}

const handleClose = (done: () => void) => {
    // ElMessageBox.confirm('Are you sure to close this dialog?')
    // .then(() => {
    //     done()
    // })
    // .catch(() => {
    //     // catch error
    // })
}

</script>


<style lang="less" scoped>
.store-list {

    padding:50px 200px;
    .header {
        display: flex;
        justify-content: space-between;
        align-items: center;
    }

}
</style>